import { Component, OnInit } from '@angular/core';
import {HttpClient, HttpParams} from "@angular/common/http";
import { EventManager } from '@angular/platform-browser';
import {NzCascaderOption} from "ng-zorro-antd/cascader";
interface Response {
  status: string;
  info: string;
  infocode: string;
  count: string;
  geocodes: [{
    "formatted_address": string;
    country: string;
    province: string;
    citycode: string;
    city: string;
    district: string;
    township: void /* undefined */[];
    neighborhood: {
      name: void /* undefined */[];
      type: void /* undefined */[];
    };
    building: {
      name: void /* undefined */[];
      type: void /* undefined */[];
    };
    adcode: string;
    street: void /* undefined */[];
    number: void /* undefined */[];
    location: string;
    level: string;
  }];
}

const options = [
  {
    value: '浙江省',
    label: '浙江省',
    children: [
      {
        value: '杭州市',
        label: '杭州市',
        isLeaf: true
      },
      {
        value: '宁波市',
        label: '宁波市',
        isLeaf: true
      }
    ]
  },
  {
    value: '江苏省',
    label: '江苏省',
    children: [
      {
        value: '南京市',
        label: '南京市',
        isLeaf: true
      }
    ]
  }
];


@Component({
  selector: 'app-geo',
  templateUrl: './geo.component.html',
  styleUrls: ['./geo.component.css']
})
export class GeoComponent implements OnInit {
  public isShowTable: boolean = false;
  public data: any = {
    status: "失败",
    townShip: "",
    province: "",
    city: "",
    zone: "",
    community: "",
    cityCode: "",
  };

  public address: any;
  public city: any;

  nzOptions: NzCascaderOption[] = options;
  values: any;

  public isShowDialog: boolean = false;

  constructor(
    private http: HttpClient,
    private eventManager:EventManager
  ) { }

  ngOnInit(): void {

    this.eventManager.addGlobalEventListener('window', 'keyup.enter', ()=> {
      console.log("你点击了enter键");
      this.getForInfo();
    })

  }

  getForInfo() {
    this.isShowTable = false;
    // 异步的方式去发送请求
    const params = new HttpParams()
      .set('addr', this.address)
      .set('city', this.values);
    this.http.get<Response>("http://localhost:8080/get-pos-info", {params}).subscribe(res => {
      // 如果获取数据成功，那么给与显示
      if (res.infocode !== null && res.infocode == "10000") {
        this.data = res;
        this.data.status= '成功';
        this.isShowDialog = true;
      } else {
        this.data.status = '失败';
      }
      console.log(res);
    });
    console.log("我被点击了")
  }

  /**
   * 监听键盘按下事件，并判断是否是enter键
   * @param $event
   */
  enterDown($event: KeyboardEvent) {
    console.log($event.key);
    // 如果是enter键被敲击，那么调用触发方法
  }

  /**
   * 省市区三级联动效果
   * @param values
   */
  onChanges(values: string[]): void {
    console.log(values, this.values);
  }

  inputOnChange(value: any) {
    console.log(value)
  }

  /**
   * 控制对话框弹出
   */
  showModal(): void {
    this.isShowDialog = true;
  }

  /**
   * 对话框确认
   */
  handleOk(): void {
    console.log('Button ok clicked!');
    this.isShowDialog = false;
  }

  /**
   * 对话框取消
   */
  handleCancel(): void {
    console.log('Button cancel clicked!');
    this.isShowDialog = false;
  }
}
